{* $Id$ *}
{include_core file="admin/lib/header.html" title="帮助中心展示"}
<div class="page-header border-bottom clearfix">
  <h2 class="left">帮助中心管理<span>{if $info}编辑{else}添加{/if}帮助中心</span></h2>
  <a href="{AnUrl('article/admin')}" class="btn btn-default btn-sm right">&lt;&nbsp;返回帮助中心列表</a>
</div>
<!--start:帮助中心新增-->
<div class="add-form">
  <form class="js_creatForm" action="{AnUrl('article/admin/save')}" method="post" enctype="multipart/form-data">
    <input type="hidden" name="id" value="{$article_info.id}">
    <table class="table" cellpadding="0" cellspacing="0">
      <tr>
        <th><label for="" class="add-f-label">所属分类：</label></th>
        <td>
          {$category_list = category_helper::get_list_by_res_name('article')}
          <select class="add-f-slt1 js_category" name="info[category_id]">
            <option value="0">请选择分类</option>
            {foreach $category_list as $k=>$v}
            <option value="{$v.id}" {if $v.id == $article_info.category_id}selected{/if}>{$v.title}</option>
            {/foreach}
          </select>
          <div class="tips"><span style="line-height: 34px;color: #f00;margin-right: 10px;">*</span>请选择内容所属分类</div>
        </td>
      </tr>
      <tr>
        <th><label for="" class="add-f-label">短标题：</label></th>
        <td>
          <input name="info[title]" style="width:490px;" value="{$article_info.title}" type="text" class="add-f-ipt1 js_title">
          <!-- <div class="tips"><span style="line-height: 34px;color: #f00;margin-right: 10px;">*</span>短标题会显示在相应内容的标题位置，最多输入 <span style="color:red;">30</span> 字，还可输入 <span class="js_titleNum" style="color:red;">30</span> 字</div> -->
        </td>
      </tr>
      <!-- <tr>
        <th><label class="add-f-label">展示方式</label></th>
        <td>
          <label class="add-f-label">
            <input type="radio" name="view_type" class="js_viewType" value="1" class="add-f-radio" {if !$article_info.link}checked{/if}>使用自定义帮助中心
          </label>&nbsp;&nbsp;
          <label class="add-f-label">
            <input type="radio" name="view_type" class="js_viewType" value="0" class="add-f-radio" {if $article_info.link}checked{/if}>使用外部连接
          </label>
        </td>
      </tr> -->
      <tr class="js_videoLink">
        <th><label for="" class="add-f-label">视频链接：</label></th>
        <td>
          <input name="info[video_link]" style="width:490px;" value="{$article_info.video_link}" type="text" class="add-f-ipt1 js_videoLink">
          <div class="tips">可选,请将上传好的视频链接填入此处</div>
        </td>
      </tr>
       <tr>
        <th><label for="" class="add-f-label">类型：</label></th>
        <td>
          <select name="info[type]" >
            <option value="0">选择类型</option>
            <option value="1" {if $article_info.type == 1} selected {/if}>商家</option>
            <option value="2" {if $article_info.type == 2} selected {/if} >经销商</option>
          </select>
          <div class="tips"></div>
        </td>
      </tr>
      
      <tr class="js_articelViewDiy">
        <th><label for="" class="add-f-label">长标题：</label></th>
        <td>
          <input name="info[alias]" style="width:490px;" value="{$article_info.alias}" type="text" class="add-f-ipt1 js_alias">
          <div class="tips"></div>
        </td>
      </tr>
      <!-- <tr class="js_articelViewDiy">
        <th valign="top"><label for="" class="add-f-label">帮助中心简介：</label></th>
        <td>
          <textarea class="add-f-area js_intro" name="info[intro]">{$article_info.intro}</textarea>
          <div class="tips">帮助中心简介会显示在相应内容的简介位置，最多输入 <span style="color:red;">80</span> 字，还可输入 <span class="js_introNum" style="color:red;">200</span> 字</div>
        </td>
      </tr> -->
      <!-- <tr class="js_articelViewDiy">
        <th valign="top"><label for="" class="add-f-label">帮助中心封面：</label></th>
        <td class="perUpOuter">
          <div class="clearfix">
            <div class="btn-upload left">
              <a href="javascript:void(0);"><i class="icon-upload"></i>上传封面</a>
              <input class="js_cover js_upFile"  type="file" name="cover">
            </div>
            <span class="tips left">&nbsp;&nbsp;&nbsp;帮助中心封面图比例：720*400</span>
          </div>
          <div class="js_upFileBox">
              {if $article_info.cover}
              <img src="{_image($article_info.cover)}" width="360">
              {/if}
          </div>
        </td>
      </tr> -->
      <tr class="js_articelViewDiy">
        <th valign="top"><label for="" class="add-f-label">帮助内容：</label></th>
        <td>
          <textarea class="js_content" name="info[content]" id="js_editor" style="width:490px;">{$article_info.content}</textarea>
          <div class="tips"><span style="line-height: 34px;color: #f00;margin-right: 10px;">*</span>帮助内容会显示在详情页显示</div>
        </td>
      </tr>
      {*<tr>
        <th><label class="add-f-label">是否显示</label></th>
        <td>
          <label class="add-f-label">
            <input type="radio" name="info[icon_show]" value="1" class="add-f-radio" {if $article_info.icon_show == 1}checked{/if}>是
          </label>&nbsp;&nbsp;
          <label class="add-f-label">
            <input type="radio" name="info[icon_show]" value="0" class="add-f-radio" {if $article_info.icon_show == 0}checked{/if}>否
          </label>
        </td>
      </tr>*}
      <tr>
        <th><label for="" class="add-f-label">排序：</label></th>
        <td>
          <input name="info[view_order]" style="width:102px;" value="{$article_info.view_order}" type="text" class="add-f-ipt1">
          <div class="tips">排序决定帮助内容的先后位置</div>
        </td>
      </tr>
      <tr><th>&nbsp;</th><td class="noborder"><button type="submit" class="btn btn-success js_submit">&nbsp;&nbsp;&nbsp;确认&nbsp;&nbsp;&nbsp;</button></td></tr>
    </table>
  </form>
</div>
<!--end:帮助中心新增-->
{load_js file='ueditor1_4_3/ueditor.config.js'}
{load_js file='ueditor1_4_3/ueditor.all.js'}
<script>
var resName = 'article';
function setNum(thisClass, maxNum) {
  var presentNum = $('.'+thisClass).val().length;
  var remainNum  = maxNum - presentNum;
  if (remainNum < 0) {
    $('.'+thisClass).val($('.'+thisClass).val().substr(0,maxNum));
    $('.'+thisClass+'Num').text(0);
  } else {
    $('.'+thisClass+'Num').text(remainNum);
  }
}

$(function(){
  {if !$article_info.link}
  var viewType = 1;
  {else}
  var viewType = 0;
  {/if}

  if (viewType == 1) {
    $('.js_articelViewDiy').show();
    $('.js_articleLink').hide();
  } else {
    $('.js_articelViewDiy').hide();
    $('.js_articleLink').show();
  }

  // 切换样式
  $('.js_viewType').on('click', function(){
    var type = $(this).val();
    if (type == 1) {
      $('.js_articelViewDiy').show();
      $('.js_articleLink').hide();
      $('.js_link').val('');
    } else {
      $('.js_articelViewDiy').hide();
      $('.js_articleLink').show();
    }
  });

  // 初始化编辑器
  var editor = new UE.ui.Editor({
       serverUrl:"{AnUrl('core/handler/file_uploader?source=ueditor&file_field=Filedata')}",
       initialFrameWidth:600,
       initialFrameHeight:385,
       elementPathEnabled:false,
       autoHeightEnabled: false,
       autoFloatEnabled: false,
       wordCount: false,
       toolbars:[['fullscreen','source', "undo","redo","justifyleft","justifycenter","justifyright","justifyjustify","lineheight","bold","italic","underline","strikethrough","fontsize","fontfamily","backcolor","forecolor","superscript","subscript","insertorderedlist","insertunorderedlist","insertimage","inserttable","emotion","spechars","unlink","link"],[]]
   });
  editor.render("js_editor");
  
  // 初始化剩余字数
  setNum('js_title', 30);
  setNum('js_intro', 200);
  $('.js_title').keyup(function(){
    setNum('js_title', 30);
  });
 $('.js_intro').keyup(function(){
    setNum('js_intro', 200);
  });
  
  {literal}
  // 提交验证
  $('.js_submit').click(function(e){
    e.preventDefault();
    var title      = $.trim($('.js_title').val());
    var category   = $('.js_category').val();
    var content    = $.trim(editor.getContent());
    var intro      = $.trim($('.js_intro').val());
    var cover      = $.trim($('.js_cover').val());
    var link       = $('.js_link').val();
    var type       = $('.js_viewType:checked').val();
    var strRegex   = "^((https|http|ftp|rtsp|mms)?://)"
                    + "?(([0-9a-z_!~*'().&=+$%-]+: )?[0-9a-z_!~*'().&=+$%-]+@)?" //ftp的user@
                    + "(([0-9]{1,3}\.){3}[0-9]{1,3}" // IP形式的URL- 199.194.52.184
                    + "|" // 允许IP和DOMAIN（域名）
                    + "([0-9a-z_!~*'()-]+\.)*" // 域名- www.
                    + "([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]\." // 二级域名
                    + "[a-z]{2,6})" // first level domain- .com or .museum
                    + "(:[0-9]{1,4})?" // 端口- :80
                    + "((/?)|" // a slash isn't required if there is no file name
                    + "(/[0-9a-z_!~*'().;?:@&=+$,%#-]+)+/?)$";
    var re = new RegExp(strRegex);

    if (!category) {
      showMsg('请选择帮助中心分类');
      return;
    }
    if (!title) {
      showMsg('标题不能为空');
      return;
    }
    /* if (type == 0 && !link) {
      showMsg('链接地址不能为空');
      return;
    } */
    /* if (type == 0 && !re.test(link)) {
      showMsg('请填写正确的网址，格式：http://www.baidu.com');
      return;
    } */
    if (!content && type == 1) {
      showMsg('内容不能为空');
      return;
    }
    if (type == 1) {
      $('.js_link').val('');
    }
    $('.js_content').val(content);
    $('.js_creatForm').submit();
  });
  {/literal}
  
  // 上传图片预览
  $(".js_upFile").each(function(i){
    $(this).change(function(e){
      handleFileSelect($(this));
    });
  });
});
</script>
{include_core file="admin/lib/footer.html"}